<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div {
            display: none;
        }
    </style>
</head>

<body>

    <div class="login">
        欢迎 <strong>xx</strong> 登陆

        <button class="out">退出</button>
        <button class="zx">注销</button>
    </div>

    <div class="noLogin">
        <a href="./reg.html">去注册</a>
        <a href="./login.html">去登陆</a>
    </div>


    <script src="../../js/cookie.js"></script>
    <script>




        // 在登陆页面有一个暗号'LOGIN'
        const user = getCookie('LOGIN');
        if (user) {
            // alert('登陆了')
            document.querySelector('.login').style.display = 'block';
            document.querySelector('strong').innerHTML = user;
        }
        else {
            // alert('没有登陆')
            document.querySelector('.noLogin').style.display = 'block';
        }



        // 退出的逻辑
        //    删除暗号 LOGIN_USER
        //    设置一个过期的时间
        // document.cookie = `LOGIN_USER=${username};expires=` + new Date(0)
        //    跳转到登陆


        document.querySelector('.out').onclick = function () {
            // 删除 LOGIN
            removeCookie('LOGIN');
            // 退回到登陆页面
            location.href = './login.html'
        }


        // 注销    注销账号，删除登陆状态
        document.querySelector('.zx').onclick = function () {
            // 删除 LOGIN
            removeCookie('LOGIN');
            removeCookie(user);
            // 退回到注册页面
            location.href = './reg.html'
        }

    </script>

</body>

</html>